<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
    .inn {
        border: 1px solid #888;
        width: 500px;
        height: 500px;
        margin: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .btn {
        margin: 10px auto;
        background-color: yellow;
    }

    .btn1 {
        margin: 10px auto;
        background-color: yellow;
    }

    .pic,
    .pic1 {
        width: 100px;
        height: 100px;
    }
</style>

<body>
    <div class="inn">
        <div>
            <img src="./images/20210517192459_ededb.gif" alt="" class="pic"></img>
            <input type="button" value="我是奶龙" class="btn">
            <div id="real"></div>
        </div>
        <div>
            <img src="./images/20210616091248_63602.gif" alt="" class="pic1"></img">
            <button class="btn1">我才是奶龙</button>
            <div id="real1"></div>
        </div>
    </div>
    <script>
        var btn = document.getElementsByClassName("btn")[0];
        var btn1 = document.getElementsByClassName("btn1")[0];
        btn.onclick = function () {
            var real = document.getElementById("real");
            real.innerHTML = "你是奶龙";
            real.style.backgroundColor = "skyblue";
            real.style.display = "inline-block";
            real1.innerHTML = '';
        }
        btn1.onclick = function () {
            var real1 = document.getElementById("real1");
            real1.innerHTML = "你是奶龙";
            real1.style.backgroundColor = "skyblue";
            real1.style.display = "inline-block";
            real.innerHTML = '';
        }
        btn.onmouseenter = function () {
            btn.style.cursor = "pointer";
        }
        // btn1.onmouseenter = function () {
        //     btn1.style.cursor = "pointer";
        // }
        btn1.addEventListener("mouseenter", function () {
            btn1.style.cursor = "pointer";
        })
    </script>
</body>

</html>